<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <title>投票记录</title>
    <link rel="stylesheet" href="/templates/default/css/frozen.css">
    <link rel="stylesheet" href="/templates/default/css/style.css">
<style>
    .ui-container{padding-bottom: 0;}
    .list01 .listend{ height: 20px}

    .ui-footer ~ .ui-container {
        border-bottom: 20px solid transparent !important;
    }

</style>
</head>
<body>

<footer class="ui-footer ui-footer-btn">
    <ul class="ui-tiled ui-border-t">
        <li>
            <div>
                <a href="/home/index/articleVote3"><img src="/templates/default/images/btn2_01.png" alt="评选投票"/></a>
            </div>
        </li>
        <li>
            <div>
                <a href="/home/index/vote_result"><img src="/templates/default/images/btn2_02a.png" alt="投票记录"/></a>
            </div>
        </li>
    </ul>
</footer>
<section class="ui-container">
    <div class="head2" id="head1">
        <img src="/templates/default/images/head5.jpg" alt="">
    </div>
    <div class="list01">
        <div id="list_div" style="background: url(/templates/default/images/list_03.png);    margin: 0; padding: 0 8%;    background-position-x: 0px;min-height:256px;background-size: contain; padding-bottom: 10px;">
            <table border="0" bordercolor="#FFFFFF" width="100%" style="font-size: 12px; font-weight: bold; color: #764131; line-height: 20px;">
                {{foreach from=$article_list item=i key=key}}
                <tr style="border-bottom: 1px solid #987a70;" id="tr_{{$i.article_id}}">
                    <td style="padding-top: 10px; padding-bottom: 5px;font-size: 14px;width: 75%;">
                        {{$i.article_title}}
                        <p style="font-weight: 100; color: #987a70;font-size: 12px;">出场：{{$i.article2_count}}人</p>
                    </td>
                    <td style="padding-left: 5px"><a onclick="cancel_vote('{{$i.article_id}}')"><img style="padding-top: 5px;width: 100%" src="/templates/default/images/tou_cancel.png"></a></td>
                </tr>
                {{/foreach}}
            </table>

            <div class="che" style=";margin-top: 30px;"><a onclick="confirm_vote()"><img src="/templates/default/images/bigbtn2.png" style="width: 100%"></a></div>
        </div>

        <div class="item person spring" style="height: 0px;"></div>

        <div class="item listend">

        </div>

    </div>

    <div class="head2" id="head2">
        <img src="/templates/default/images/head5.jpg" alt="">
        <img src="/templates/default/images/nodata.png" alt="">
    </div>

</section>

<script src="/templates/default/js/lib/zepto.min.js"></script>
<script src="/templates/default/js/frozen.js"></script>
<div class="ui-dialog">
    <div class="ui-dialog-cnt" style="width:90%; background:none;">

        <img src="/templates/default/images/cancel_all.jpg" style="width:100%;" alt="">

        <div class="ui-dialog-ft" style="
            position: absolute;
            right: 50%;
            top: 76%;
            color: rgba(0,0,0,0);
        ">
            <button type="button" data-role="button" style="color:rgba(0,0,0,0);" onclick="cancel_allVote()">确定</button>
        </div>

        <div class="ui-dialog-ft" style="
            position: absolute;
            left: 50%;
            top: 76%;
            color: rgba(0,0,0,0);
        ">
            <button type="button" data-role="button" style="color:rgba(0,0,0,0);" onclick="cancel()">返回</button>
        </div>
    </div>
</div>
<div id="count_result" style="display: none;">{{$count_result}}</div>
<script class="demo-script">
    var count_r = $('#count_result').html();
    $(function(){
        if(count_r>0){
            $('#head2').css('display','none');
        }else if(count_r==0){
            $('#head1').css('display','none');
            $('.list01').css('display','none');
        }
    })

    //一键撤销
    function confirm_vote(){
        $(".ui-dialog").addClass("show");
    }

    function cancel_allVote(){
        var url = '/home/index/cancelAllVote';
        $.ajax({
            url: url,
            data: {
                //article_id: article_id
            },
            type: 'POST',
            cache: false,
            dataType: 'html',
            success: function (data) {
                //alert(data);return;
                if(data==1){
                    location.reload();//刷新当前页
                }
            },
            error: function () {
                //alert("AJAX异常！");
            }
        });
    }

    function cancel_vote(article_id){
        var url = '/home/index/cancelVote';
        $.ajax({
            url: url,
            data: {
                article_id: article_id
            },
            type: 'POST',
            cache: false,
            dataType: 'html',
            success: function (data) {
                if(data==1){
                    if(article_id==''){//撤销所有
                        $('#list_div').css('display','none');
                        cancel();
                        $('#head1').css('display','none');
                        $('.list01').css('display','none');
                        $('#head2').css('display','inline');
                    }else{
                        count_r = count_r-1;
                        $("tr[id='tr_"+article_id+"']").remove();
                        //$('#div_'+article_id).css('display','none');
                        if(count_r<=0){
                            $('#head1').css('display','none');
                            $('.list01').css('display','none');
                            $('#head2').css('display','inline');
                        }
                    }
                }
            },
            error: function () {
                //alert("AJAX异常！");
            }
        });
    }
    function cancel(){
        $(".ui-dialog").removeClass("show");
    }

</script>

</body>
</html>